<script setup>
import { ref, onMounted, onUnmounted } from 'vue'
import FlyInfo from './component/fly-info.vue'
import FlyTable from './component/fly-table.vue'
import AirspacePop from './pop/AirspacePop.vue'
import FlySituation from './component/fly-situation.vue'
import Legendbox from './component/Legend.vue'
import { usePopStore } from '@/stores'
import { managementInit, managementClear, addAirSpace } from './js/management'
const popStore = usePopStore()
const tabList = ref(['适飞空域', '禁飞空域'])

const chosedBar = (val) => {
  popStore.Airspace.showPop = false
  if (val == '适飞空域') {
    __g.infoTree.showByGroupId(['spaceGrid-shifei'])
    __g.infoTree.hideByGroupId(['spaceGrid-guankong'])
    __g.camera.set(537774.03, 2489244.6425, 6960.361875, -20.365765, -129.461258, 1)
  } else if (val == '禁飞空域') {
    addAirSpace('guankong')
    __g.infoTree.showByGroupId(['spaceGrid-guankong'])
    __g.infoTree.hideByGroupId(['spaceGrid-shifei'])
    __g.camera.set(537774.03, 2489244.6425, 6960.361875, -20.365765, -129.461258, 1)
  } else if (val == '空域网格化') {
    window.open('https://kzlw.shiyan.iwhere.com:7443/shiyan-screen/#/screen/ScreenHome', '_blank')
  }
}
onMounted(() => {
  managementInit()
})
onUnmounted(() => {
  popStore.Airspace.showPop = false
  managementClear()
})
</script>

<template>
  <RightBox>
    <FlyInfo></FlyInfo>
    <FlyTable></FlyTable>
    <FlySituation></FlySituation>
    <AirspacePop />
  </RightBox>
  <Legendbox />
  <BottomBar :list="tabList" @chosedBar="chosedBar" />
</template>
<style scoped lang="scss"></style>
